/*
 * @Description: 打开弹窗高阶组件
 * @Author: Rfan
 * @Date: 2022-02-25 14:26:24
 * @LastEditTime: 2022-03-26 12:59:15
 */

import { FC, ReactNode } from 'react';
// @ts-ignore
import { render, unmountComponentAtNode } from 'react-dom';

interface WithDialogProps {
  _ele: any;
  _dom: ReactNode;
  _visible: boolean;
}
export default class WithDialog implements WithDialogProps {
  _ele: any;

  _dom: ReactNode;

  _visible: boolean;

  constructor(Component: FC, props: any) {
    this._ele = null;
    this._visible = true;
    this._dom = <Component visible={this._visible} onCancel={this.close} {...props} />;
    this.show();
  }

  show = () => {
    this._ele = document.createElement('div');
    render(this._dom, document.body.appendChild(this._ele));
  };

  close = () => {
    // TODO: 没有关闭动画，体验不好
    unmountComponentAtNode(this._ele);
    this._ele.remove();
  };
}
